<template>
  <view class="home">
    <form-item :formJson="formJson" @handleSubmit="handleSubmit"></form-item>
  </view>

</template>

<script setup>
  import {
    onMounted,
    ref
  } from 'vue';
  import formItem from '@/components/form-item/form-item.vue';
  import { articlePublish, category } from '../../../config/api';
  const formJson = ref([{
    label: '文章类型',
    type: 'select',
    key: 'category_id',
    key_text: 'category_text',
    placeholder: '请选择',
    selectList: [],
    border: true
  }, {
    label: '文章标题',
    type: 'text',
    key: 'title',
    placeholder: '请输入',
    border: true
  }, {
    label: '文章内容',
    type: 'textarea',
    key: 'content',
    placeholder: '请输入内容',
    labelPosition: 'top'
  }, {
    label: '',
    type: 'upload',
    border: true
  }, {
    label: '推荐房源',
    type: 'houseItem',
    placeholder: '请选择',
  }, {
    label: '单次红包金额',
    type: 'text',
    key: 'hb_price',
    placeholder: '请输入',
    suffix: '元',
    required: true,
    border: true
  }, {
    label: '总计奖励次数',
    type: 'text',
    key: 'hb_number',
    placeholder: '请输入',
    suffix: '元',
    required: true,
    border: true
  }, {
    label: '总计金额',
    type: 'total_money',
  }, ])
  onMounted(() => {
    _category()
  })
  // 提交
  const handleSubmit = (row) => {
    articlePublish(row).then(res => {
      uni.$u.toast(res.msg)
      setTimeout(() => {
        uni.navigateBack()
      }, 500)
    })
  }
  // 文章类型
  const _category = () => {
    category().then(res => {
      formJson.value[0].selectList = res.data
    })
  }
</script>

<style scoped lang="scss">
  .home {
    padding: 0 24rpx;
    background: #fff;
    padding-bottom: calc(200rpx + env(safe-area-inset-bottom));

    ::v-deep .u-form-item__body__left__content__label {
      font-size: 30rpx !important;
      font-weight: 500;
    }

    ::v-deep .u-form-item__body {
      padding: 30rpx 0 !important;
    }

    ::v-deep .u-form-item__body__left__content__required {
      left: auto !important;
      right: -12rpx;
    }

    ::v-deep .u-textarea {
      background: #f8f8f8;
    }
  }
</style>